<div class="sixteen wide column">
  <form class="ui form" {{action 'submit' on='submit'}}>
    <div class="field {{if this.device.isMobile 'sixteen' 'five'}} wide column">
      <label class="required" for="file"> {{t 'Select event source file to import'}}</label>
      <input accept='.zip,.xml,.ical,.ics,.xcal' type="file" disabled={{this.disabled}} onchange={{action 'onFileSelected' value='target.files'}}>
    </div>
    <div class="field {{if this.device.isMobile 'sixteen' 'five'}} wide column">
      <span class="text muted">
        <b>{{t 'Supported formats:'}}</b>
        {{t 'Open Event compatible json package (.zip), PentabarfXML (.xml), iCalendar (.ical, .ics), XML Representation of iCalendar (.xcal)'}}
      </span>
    </div>
    <button class="ui small primary button" type="submit" disabled={{this.isImporting}}>{{t 'Import Event'}}</button>
    <div style="margin-top: 10px;">
      <span>{{this.importStatus}}</span><br>
      <span class="red">{{this.importError}}</span>
    </div>
  </form>
</div>
